<!DOCTYPE HTML>
<html lang="zh">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <meta content="no-cache" http-equiv="cache-control">
    <link href="styles/form.css" rel="stylesheet" type="text/css"/>
	<link href="styles/doc.css" rel="stylesheet" type="text/css"/>
    <link href="scripts/highlighter/styles/shCore.css" rel="stylesheet" type="text/css"/>
    <link href="scripts/highlighter/styles/shThemeDefault.css" rel="stylesheet" type="text/css"/>
	<script src="scripts/vue.js"></script>
    <script type="text/javascript" src="scripts/mootools.js"></script>
    <script type="text/javascript" src="scripts/jspxnet.js"></script>
    <script type="text/javascript" src="scripts/highlighter/scripts/shCore.js"></script>
    <script type="text/javascript" src="scripts/highlighter/scripts/shBrushCss.js"></script>
    <script type="text/javascript" src="scripts/highlighter/scripts/shBrushXml.js"></script>
    <script type="text/javascript" src="scripts/highlighter/scripts/shBrushJava.js"></script>
    <script type="text/javascript" src="scripts/highlighter/scripts/shBrushJScript.js"></script>
    <script type="text/javascript">
		function trim(value) {
			/**去除首尾空白 */
			return value.replace(/(^\s*)|(\s*$)/g, "").replace(/\//g,'_');
		}
		
		function goAnchor(e)
		{
			var refId = e.target.getAttribute('refId');
			refId = trim(refId);
			var anchor = document.getElementById(refId);
			
			document.body.scrollTop = anchor.offsetTop; // chrome
			document.documentElement.scrollTop = anchor.offsetTop; // firefox	 */	
		}
	    //定义treeviewitem组件
		 Vue.component('treeviewitem', {props: ['items', 'self'],template: '#treeviewitem'});
		 Vue.component('treeparamitem', {props: ['items', 'self'],template: '#treeparamitem'});
		 

		 //定义treeview组件
		Vue.component('treeview', {props: ['items'],template: '#treeview'});
		Vue.component('treeparamview', {props: ['items'],template: '#treeparamview'});
		

        function getUrlParam(name) {
            var reg = new RegExp('(^|&)' + name + '=(.*)(&[^&=]+=)');
            var regLast = new RegExp('(^|&)' + name + '=(.*)($)');
            var r = window.location.search.substr(1).match(reg) || window.location.search.substr(1).match(regLast);
            if (r != null) {
                var l = r[2].match(/&[^&=]+=/)
                if (l) {
                    return decodeURIComponent(r[2].split(l[0])[0]);
                } else return decodeURIComponent(r[2]);
            }
            return null;
        }

        window.addEvent('domready', function () {
            var id = getUrlParam("id");
            if (!id) return;
            new Request.ROC({
                    'url': 'document/' + id + '.jwc',
                    'link': "ignore",
                    'async': false,
                    'timeout': 10000,
                    onSuccess: function (obj) {
                        if (obj.success && obj.data) {
                            $('title').set('html', obj.data.title);

                        }
                        if (obj.success && obj.data) {
                            new Vue({
                                el: '#apiDoc',
                                data: obj.data
                            });
                            SyntaxHighlighter.config.clipboardSwf = 'scripts/highlighter/scripts/clipboard.swf';
                            SyntaxHighlighter.all();

                        }
                    }
                    ,
                    onException:function(headerName, value) {
                        $('apiDoc').adopt("请求失败," + value);
                    }
                }
            ).send();
        });

    </script>
    <title>jspx.net-api文档生成</title>
</head>
<body>

  <!-- treeviewitem 返回模板 -->
  <template id="treeviewitem" style="display: none;">
							  <div class="row w1column child">
										<div class="con shortText">
											<label class="filed">{{ self.name }}</label>
											<label class="filedType">{{ self.type }}</label>
											<label class="caption">{{ self.caption }}</label>
									     </div>
										   <div v-if="typeof(self.children)!=='undefined'" v v-for="item in self.children">
											   <treeviewitem v-bind:items="item.children" v-bind:self="item"></treeviewitem>
										  </div>    
										  
							 </div>
	</template>


  <template id="treeview">
    <div>
      <div v-for="item in items">
        <treeviewitem v-bind:items="item.children" v-bind:self="item"></treeviewitem>
      </div>
    </div>
  </template>


  <!-- treeviewitem 参数模板 -->
  <template id="treeparamitem" style="display: none;">
							  <div class="row w1column child">
										<div class="con shortText">
											<label class="filed">{{ self.name }}</label>
											<label class="filedType">{{ self.filedType }}</label>
											<label class="required">{{ self.required }}</label>
											<label class="safety">{{self.safety}}</label>
											<label class="caption">{{ self.caption }} {{self.format }}</label>
									     </div>
										   <div v-if="typeof(self.children)!=='undefined'" v v-for="item in self.children">
											   <treeparamitem v-bind:items="item.children" v-bind:self="item"></treeparamitem>
										  </div>    
										  
							 </div>
	</template>



  <template id="treeparamview">
    <div>
      <div v-for="item in items">
        <treeparamitem v-bind:items="item.children" v-bind:self="item"></treeparamitem>
      </div>
    </div>
 </template>

<div id="container" class="formContainer borderFieldset">
    
    <div id="apiDoc" v-cloak>

        <fieldset>
			<legend><span class="tit" id="title"><span></legend>
	
            <div class="row w1column"><label class="tit">类对象</label>
                <div class="con">
                    {{ className }}
                </div>
            </div>

            <div class="row w1column"><label class="tit">URL入口</label>
                <div class="con">
                    {{ url }}
                </div>
            </div>

			<div class="row w1column index">
				<label class="tit">功能目录</label>
				<div class="con">
					<ul v-if="typeof(operateList)!=='undefined'">
						<li v-for="op in operateList">
							<a @click="goAnchor($event)" v-bind:refId="op.method.name" class="caption">{{ op.caption }}</a>
						</li>
					</ul>
				</div>
		</div>	
		
			<div v-if="typeof(describe)!=='undefined'&&describe" class="row w1column"><label class="tit">描述</label>
                <div class="con">
					<p v-html='describe'></p>&nbsp;
                </div>
            </div>
        </fieldset>
	 
		 
		<div class="w1column clear"><hr /></div>
        <fieldset v-if="typeof(operateList)!=='undefined'" >
            <div v-for="op in operateList">
                    <div :id="[trim(op.method.name)]" class="row" style="background-color: aliceblue;"><label class="tit">名称</label>
                        <div class="con">
                            {{ op.caption }}
							
                        </div>
                    </div>

                    <div class="row" style="background-color: aliceblue;"><label class="tit">方法名</label>
                        <div class="con">
                            {{op.method.name}}
                        </div>
                    </div>

                    <div class="row"><label class="tit">URL</label>
                        <div class="con">
                            {{op.url}}.jwc
                        </div>
                    </div>
                    <div class="row"><label class="tit">调用方法</label>
                        <div class="con">
                            {{ op.action }}
                        </div>
                    </div>

					<div class="row w1column"  v-if="typeof(op.describe)!=='undefined'">
							<div v-html='op.describe'></div>
					</div>

                    <div v-if="Object.keys(op.method.params).length!=0">
						 <div class="row w1column" style="background-color: aliceblue;">
								<label class="tit">请求参数</label>
						</div>
                        <div class="row w1column">
                            <div class="con shortText">
                                <label class="filedTh">名称</label>
                                <label class="filedType">类型</label>
                                <label class="required">必须</label>
                                <label class="safety">值域</label>
                                <label class="caption">描述</label>
                            </div>
                        </div>
                       
                        <div v-for="(p,key, index) in op.method.params" class="row w1column">
                                <div class="con shortText">
                                    <label class="filed">{{ p.name }}</label>
                                    <label class="filedType">{{ p.filedType }}</label>
                                    <label class="required">{{p.required }}</label>
                                    <label class="safety">{{p.safety}}</label>
                                    <label class="caption">{{p.caption }} {{p.format }}</label>
                                </div>
                        </div>
						<div v-for="(p,key, index) in op.method.params">
							<div  v-if="Object.keys(p.children).length!=0" class="row w1column"><label class="tit">包含字段</label></div>
								<div v-for="(c,ckey, cindex) in p.children">
									<div class="row w1column">
										<div class="shortText">
											<label class="filed">{{ c.name }}</label>
											<label class="filedType">{{ c.filedType }}</label>
											<label class="required">{{c.required }}</label>
											<label class="safety">{{c.safety}}</label>
											<label class="caption">{{c.caption }} {{c.format }}</label>
										</div>
									</div>
									<treeparamview v-bind:items="c.children"></treeparamview>
								</div>
							</div>
						</div>

						<div class="w1column"></div>

						<div v-if="op.methodJson!='{}'" class="row w1column">
							<fieldset>
							 <legend>请求例子</legend>
							
								<pre class="brush:js">{{op.methodJson}}</pre>
								<span class="note clear">说明:调用方法名和url文件名相同时,可以是用简化参数调用,包含protocol="jspx.net-roc"为标准调用</span>
							
							</fieldset>
						</div>

						<div class="row w1column"><label class="tit">返回模型</label><p>{{ op.resultType }}</p></div>

						<div v-if="typeof(op.result)!=='undefined'">
								<div class="row w1column">
									<div class="con shortText">
										<label class="filedTh">名称</label>
										<label class="filedType">类型</label>
										<label class="caption">描述</label>
									</div>
								</div>

								 <div  v-for="(r, index) in op.result">
									<div class="row w1column">&nbsp;
										<div class="con shortText">
											<label class="filed">{{ r.name }}</label>
											<label class="filedType">{{ r.type }}</label>
											<label class="caption">{{r.caption }}</label>
										</div>
									</div>
									<!-- 使用treeview组件 -->
									<treeview v-bind:items="r.children"></treeview>
								</div>
						</div>	
					    <div class="row w1column clear"><hr /></div>
            </div>
        </fieldset>
		
        <!--------- 参数--------->
        <fieldset v-if="typeof(params)!=='undefined'&&Object.keys(params).length!=0">
			<legend>全局参数</legend>
            <div class="row w1column"><label class="tit">说明</label>
                <div class="con">根据业务逻辑,来确定是否需要,一般是显示列表等功能使用。不是必须参数。主要是兼容老接口调用方式.</div>
            </div>

            <div class="row w1column"><label class="tit">序号</label>
                <div class="con shortText">
                    <label class="filedTh">名称</label>
                    <label class="filedType">类型</label>
                    <label class="required">必须</label>
                    <label class="safety">值域</label>
                    <label class="caption">描述</label>
                </div>
            </div>

            <div v-for="(p, key,index) in params">
                <div class="row w1column"><label class="tit">{{index+1}}</label>
                    <div class="con shortText">
                        <label class="filed">{{ p.name }}</label>
                        <label class="filedType">{{ p.filedType }}</label>
                        <label class="required">{{p.required }}</label>
                        <label class="safety">{{p.safety}}</label>
                        <label class="caption">{{p.caption }}</label>
                    </div>
                </div>
            </div>
        </fieldset>
		
		<div id="topPanel" ><a href="#container">Top</a></div>
    </div>

</div>

</body>
</html>